/**
 * Created by JetBrains WebStorm.
 * User: liucw
 * Date: 12-3-25
 * Time: 下午10:29
 * To change this template use File | Settings | File Templates.
 */
$(document).ready(function()
{

    var NoShape=0;
    var ZShape=1;
    var SShape=2;
    var LineShape=3;
    var TShape=4;
    var SquareShape=5;
    var LShape=6;
    var MirroredLShape=7;

    var colorArray = ["black","fuchsia","#cff","red","orange","aqua","green","yellow"];
    var shapeArray = [
        [ [ 0, 0 ],   [ 0, 0 ],   [ 0, 0 ],   [ 0, 0 ] ],
        [ [ 0, -1 ],  [ 0, 0 ],   [ -1, 0 ],  [ -1, 1 ] ],
        [ [ 0, -1 ],  [ 0, 0 ],   [ 1, 0 ],   [ 1, 1 ] ],
        [ [ 0, -1 ],  [ 0, 0 ],   [ 0, 1 ],   [ 0, 2 ] ],
        [ [ -1, 0 ],  [ 0, 0 ],   [ 1, 0 ],   [ 0, 1 ] ],
        [ [ 0, 0 ],   [ 1, 0 ],   [ 0, 1 ],   [ 1, 1 ] ],
        [ [ -1, -1 ], [ 0, -1 ],  [ 0, 0 ],   [ 0, 1 ] ],
        [ [ 1, -1 ],  [ 0, -1 ],  [ 0, 0 ],   [ 0, 1 ] ]
    ];

    /*
    转换坐标，由标准XY坐标转成画布中的坐标
     */
    function translate(data,row,col)
    {
        var newData = [];
        for(var i = 0; i < 4 ; i++)
        {
            var temp = {};
            temp.row = row + data[i,1];
            temp.col = col + data[i,0];
            newData.push(temp);
        }
        return newData;
    }
    /*
    变形，向右旋转
     */
    function rotate(data)
    {
        var newData = [[],[],[],[]];
        for(var i = 0; i < 4 ; i++)
        {
            newData[i,0] = data[i,1];
            newData[i,1] = data[i,0];
        }
        return newData;
    }

    /*
    游戏屏幕，或者说 游戏地图
     */
    function Map(width,height)
    {
        this.width = width;
        this.height = height;

        this.lines = [];
        for(var row = 0; row < height;row ++)
        {
            this.lines[row] = this.newLine();
        }
    }
    /*
    生产新的一行
     */
    Map.prototype.newLine = function()
    {
        var shapes = [];
        for(var col = 0; col < this.w ; col++)
        {
            shapes[col] = NoShape;
        }
        return shapes;
    }
    /*
    判断某一行是否满了，是否可以消掉了
     */
    Map.prototype.isFullLine = function(row)
    {
        var line = this.lines[row];
        for(var i = 0; i < this.width ; i++)
        {
            if(line[i] == NoShape)
                return false;
        }
        return true;
    }
    /*
      * 预先移动或者旋转形状，然后分析形状中的四个点是否有碰撞情况：
      *      1：col<0 || col>this.width 超出左右边界
      *      2：row==this.height ，说明形状已经到最底部
      *      3：任意一点的 shape_id 不为 NoShape ，则发生碰撞
      *  如果发生碰撞则放弃移动或者旋转
      */
    Map.prototype.isCollide = function(data)
    {
        for(var i = 0 ; i < 4 ; i++)
        {
            var row = data[i].row;
            var col = data[i].col;
            if(col < 0 || col > this.width)
                return true;
            if(row == this.height)
                return true;
            if( row < 0)
                continue;
            else if(this.lines[row][col].shape != NoShape)
                return true;
        }
        return false;
    }
    /*
    发生碰撞则将方块加入到map中
     */
    Map.prototype.appendShape = function(shape_id,data)
    {
        for(var i = 0; i < 4 ;i++)
        {
            var row = data[i].row;
            var col = data[i].col;
            this.lines[row][col].shape = shape_id;
        }

        for(var row = 0; row < this.height; row++)
        {
            if(this.isFullLine(row))
            {
                //将满的那一行替换成新的空，这一步主要是为了显示效果，可以不要！
                //this.lines[row]=null;
                //重绘 Map 消除效果
                //onClearLine(row);
                //将满行删除
                this.lines.splice(row,1);
                //第一行添加新的一行
                this.lines.unshift(this.newLine());
                //重绘 Map 整行下落效果
                onDraw(this.lines);

            }
        }
    }

    /*
      说明：GameModel 类
    */
    function GameModel(w,h){
        this.map=new Map(w,h);
        this.born();
    }

    GameModel.prototype.born = function()
    {
        this.shape_id = Math.floor(Math.random()*7)+1;
        this.data = shapeArray[this.shape_id];

        this.row = 1;
        this.col = Math.floor(this.map.width/2);

        onMove(this.shape_id,this.map,this.data);
    }






    var Spacing = 20;

//在内存中绘制一个小方块
        function drawRect(color){
            var temp=new Surface(Spacing,Spacing,"rgba(255,255,255,0.2)");//背景色
            temp.fillRect(1, 1, Spacing-2, Spacing-2, color);//前景色
            return temp;
        }

        var display= Display.attach(document.getElementById("eluosiCanvas"));
        var model = new GameModel(display.width/Spacing,display.height/Spacing);


        function onDraw(map){
            //清屏
            display.clear();
            var lines=map.lines;
            //依次绘制每一个非空的格子
            for(var row=0;row<map.height;row++)
                for(var col=0;col<map.width;col++){
                    var shape_id=lines[row][col];
                    if(shape_id!=NoShape){
                        var rect = drawRect(colorArray[shape_id]);
                        var y=row * Spacing;
                        var x=col * Spacing;
                        display.draw(rect, x, y);
                    }
                }
        }

        function onMove(shape_id,map,data){
            onDraw(map);
            //绘制当前的形状
            for(var i=0;i<4;i++){
                var y=data[i].row * Spacing;
                var x=data[i].col * Spacing;
                var rect = drawRect(Colors[shape_id]);
                display.draw(rect, x, y);
            }
        }

        function down(){
            model.down();
        }

        function left(){
            model.left();
        }

        function right(){
            model.right();
        }

        function rotate_click(){
            model.rotate();
        }



}

)